WDV221 Intro Javascript

Style Object - CSS Interactions - In Class Exercise 9

Please modify this page to create the following Dynamic HMTL effects.

1. Click this paragraph to change the font color from "black to red" and "red to black".

2. Mouseover this paragraph to change the font color to black.

3. Mousover this paragraph to center the H3 element containing "CSS Interactions". (NOTE: On mouseout it will return to the left.)

4. Click the button to left (NOTE: I will move right, since I have already moved left) align the H3 element.

5. Part 1. Mouseover this paragraph to change the font to a font of your choice. Part 2. Click on this paragraph to return the font to the default font.

6. Click on the button to make the word SALE font size 24.

7. Click on the button to return the word to its original size.

8. Use an eventhandler of your choice on this paragraph to make the paragraph background color yellow.

9. Use an onclick event to hide the Earl Scruggs picture shown below. CLICK HERE!!!

10. Use the following button to make the Earl Scruggs picture shown below reappear.

11. Mouseover the following image to make its height and width double its original size.


Mouse over to double the size and click picture to return to normal size.


Mouse over to double the size and mouse out to return to normal size.

12. Use a click event on the image to make it return to original size.